{$layout}

<h3>添加Fastcgi服务</h3>

<form  class="ui form" data-tea-action="/proxy/fastcgi/add" data-tea-success="addSuccess">
    <input type="hidden" name="server" :value="server.filename"/>
    <input type="hidden" name="locationId" :value="locationId"/>
    <table class="ui table definition">
        <tr>
            <td class="title">Fastcgi地址</td>
            <td>
                <input type="text" name="pass" placeholder="比如 127.0.0.1:9000" maxlength="100" style="width:14em"/>
            </td>
        </tr>
        <tr>
            <td>自定义参数集</td>
            <td>
                <div v-for="(param, index) in params">
                    <div class="ui field" style="margin:0" v-if="param.nameZh.length > 0"><label>{{param.nameZh}}：</label></div>
                    <div class="ui fields inline" >
                        <div class="ui field">
                            <input type="text" name="paramNames" placeholder="参数名" v-model="param.name" style="width:14em" />
                        </div>
                        <div class="ui field">
                            <input type="text" name="paramValues" placeholder="参数值" v-model="param.value" style="width:16em"/>
                        </div>
                        <div class="ui field">
                            <a href="" title="删除" v-on:click.prevent="removeParam(index)"><i class="ui icon remove"></i> </a>
                        </div>
                    </div>
                </div>

                <button class="ui button" type="button" v-on:click.prevent="addParam()">+</button>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <a href="" v-if="!advancedOptionsVisible" @click.prevent="showAdvancedOptions()" style="font-weight:normal">更多选项 <i class="icon down angle"></i> </a>
                <a href="" v-if="advancedOptionsVisible" @click.prevent="showAdvancedOptions()" style="font-weight:normal">收起选项 <i class="icon up angle"></i> </a>
            </td>
        </tr>
        <tbody v-show="advancedOptionsVisible">
            <tr>
                <td>读取超时时间</td>
                <td>
                    <div class="ui right labeled input" style="width:7em">
                        <input type="number" name="readTimeout" maxlength="10" placeholder="比如 30"/>
                        <span class="ui basic label">秒</span>
                    </div>
                </td>
            </tr>
            <tr>
                <td>连接池尺寸</td>
                <td>
                    <input type="text" name="poolSize" value="0" maxlength="4" style="width:7em"/>
                    <p class="comment">0表示不限制，通常可以设置为CPU数量的两倍</p>
                </td>
            </tr>
            <tr>
                <td>是否启用</td>
                <td>
                    <div class="ui checkbox">
                        <input type="checkbox" name="on" value="1" checked="checked"/>
                        <label></label>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
    <button class="ui button primary" type="submit">保存</button> &nbsp; <a :href="from">返回</a>
</form>